<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head lang="en">
    <meta charset="UTF-8">
    <title>用户数据页</title>
</head>
<body>
<div class="row">
    <div class="col-lg-6">
        <div id="editable-sample_length" class="dataTables_length">
            <label><select size="1" th:value="${size}" name="editable-sample_length" aria-controls="editable-sample" class="form-control xsmall" th:onchange="|bookDataBySize(this)|" >
                <option th:selected="${size == 5}" value="5" >5</option>
                <option th:selected="${size == 10}" value="10" >10</option>
                <option value="15" th:selected="${size == 15}" >15</option>

            </select> records per page</label></div></div>
    <div class="col-lg-6">
        <div class="dataTables_filter" id="editable-sample_filter">
            <label  >Search: <input th:onblur="|username('','','')|" id="usernameid" type="text" placeholder="UserName" aria-controls="editable-sample" class="form-control medium"  ></label>
        </div>
    </div>
</div>

<table class="table table-striped table-hover table-bordered" id="editable-sample">
    <thead>
    <tr>
        <th>用户名</th>
        <th>邮箱</th>
        <th>电话</th>
        <th>位置</th>
        <th>查看-修改密码</th>
        <th>删除</th>
    </tr>
    </thead>
    <tbody>
    <tr class=""  th:each="user: ${iPage.getRecords()}">
        <td th:text="${user.username}">Jonathan</td>
        <td th:text="${user.email}">Smith</td>
        <td th:text="${user.phone}">3455</td>
        <td  th:text="${user.company}">Lorem ipsume</td>
        <td><a th:href="@{/getuserByID(id=${user.id})}">查看</a> &nbsp; <a data-toggle="modal" data-target="#upuser" th:onclick="|Values(${user.id})|">修改密码</a></td>
        <td><a th:onclick="|Delete(${user.id})|">Delete</a></td>
    </tr>

    </tbody>
</table>
    <div class="row-fluid">
        <div class="span6">
            <div class="dataTables_info" id="dynamic-table_info">
                当前第[[${iPage.current}]]页 总计 [[${iPage.pages}]]页 共[[${iPage.total}]]条记录
            </div>
        </div>
        <div class="span6">
            <div class="dataTables_paginate paging_bootstrap pagination">
                <ul>
                    <li class="prev disabled" th:classappend="${cur == 1} ? 'disabled' : ''">
                        <a th:style="${cur == 1} ? 'pointer-events:none' : ''" href="javascript:void(0)" th:onclick="|loadData(${pre},${size})|">← 前一页</a></li>
                    <li th:class="${num==iPage.current?'active':''}"
                        th:each="num:${#numbers.sequence(1,iPage.pages)}">
                        <a th:onclick="|loadData(${num},${size})|">[[${num}]]</a>
                    </li>
                    <li class="next disabled" th:classappend="${cur == last} ? 'disabled' : ''">
                        <a th:style="${cur == last}  ? 'pointer-events:none' : ''" href="javascript:void(0)" th:onclick="|loadData(${next},${size})|">下一页 &rarr;</a>
                </ul>
            </div>
        </div>
    </div>



</body>
</html>